@charset 'UTF-8';

.message-box {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  text-align: center;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.message-box:after {
  content: "";
  display: inline-block;
  width: 0;
  height: 100%;
  vertical-align: middle;
}
.message-cont {
  display: inline-block;
  border-radius: 10px;
  background: #fff;
  text-align: left;
  vertical-align: middle;
  overflow: hidden;
}
.citys-box {
    width: 550px;
}
.citys-head {
  height: 54px;
  padding: 0 20px;
  line-height: 54px;
  font-size: 18px;
  color: #fff;
  text-align: center;
  background: #00bba4;
}
.citys-cont {
  padding: 0 10px;
}
.citys-tabs {
  height: 49px;
  border-bottom: 1px solid #d6d6d6;
  margin-bottom: 22px;
  line-height: 50px;
}

.citys-tabs > li {
  min-width: 50px;
  height: 49px;
  padding: 0 10px;
  font-size: 16px;
  text-align: center;
  color: #686868;
  cursor: pointer;
}
.citys-tabs > .tab-active {
  height: 48px;
  border-bottom: 2px solid #00bba4;
  font-weight: bold;
  color: #00bba4;
}

.citys-location {
  margin-bottom: 15px;
  padding-left: 55px;
  font-size: 16px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAATCAMAAACX3symAAAAdVBMVEUAAAAAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6MAu6O4i+2IAAAAJnRSTlMA4dfn9cu4G+7CbWhHPCIUDwgE+se9sJB1VSbq2tKXhmVaU0Q1MPMzGogAAACUSURBVBjTTY5HEoNADAQFmCXnjHOa/z/RIxXG7oO2ehWFVNngBf0cifHsYZwfakWMjW5hZQjieRZXSfkEaVne9GOShDETcj8AvgQMlWoTskyOQFirtomqDxxy1VfMWXIBq4umfeuGQfIOzI+jbU+lcdjxeefy01knur8kWe1AW2BkMK6yMam5+qu1Y2MpO1FyKkT5APjuFGLKpHtWAAAAAElFTkSuQmCC)
    no-repeat 30px 0;
}

.citys-location .label {
  color: #393939;
}

.citys-location .name {
  color: #00bba4;
}
.citys-main {
  padding: 0 10px 30px 30px;
  color: #585858;
}
.citys-main .citys-hide {
  display: none;
}

.citys-main .citys-item {
  overflow: hidden;
}
.citys-main .citys-item dt {
  float: left;
  margin: 13px 0 0 1px;
  color: #ff7800;
}
.citys-main .citys-item dd {
  font-size: 0;
  overflow: hidden;
}
.citys-main .citys-list {
  display: inline-block;
  padding: 5px 7px;
  margin: 5px 0 0 5px;
  font-size: 14px;
  white-space: nowrap;
}

.citys-main .citys-list:hover {
  color: #00bba4;
}